import React, { Component } from 'react';
import { Button } from 'antd';
import store from '../../../redux/store';
import Header from './Header'
import {incrementCount, decrementCount, incrementCountAsync} from '../../../redux/action/simpleCounter';

export default class SimpleCounter extends Component {
  increment = () => {
    store.dispatch(incrementCount(store.getState().simpleCounter.baseNum))
  }
  decrement = () => {
    store.dispatch(decrementCount(store.getState().simpleCounter.baseNum))
  }
  incrementIfOdd = () => {
    const { count, baseNum } = store.getState().simpleCounter
    if(count % 2 !== 0) store.dispatch(incrementCount(baseNum))
  }
  incrementAsync = () => {
    store.dispatch(incrementCountAsync(store.getState().simpleCounter.baseNum))
  }
  render() {
    return (
      <div>
        <Header />
        <Button onClick={this.increment}>+</Button>&nbsp;
        <Button onClick={this.decrement}>-</Button>&nbsp;
        <Button onClick={this.incrementIfOdd}>和为奇数时加</Button>&nbsp;
        <Button onClick={this.incrementAsync}>异步加</Button>&nbsp;
      </div>
    )
  }
}
